<template>
	<div class="page signIn-page" data-page="signIn" style="z-index: 2;">
		<div class="link-page-nav">
			<a href="#" class="link" @click="$root.backToTab()"> <i
				class="iconfont icon-zuo"></i>
			</a>
			<div class="link-page-top" style="padding-bottom: 17px;width: 100%;display: inline-flex;justify-content: center;">
				<!-- <div class="link-page-title">签到</div> -->
				<!-- <a href="/signInRecord/0/" class="link" style="color: #000;"> 
					<i class="iconfont icon-APPicon_lishi" style="font-size: 23px;"></i>
				</a> -->
				<p class="segmented" id="segmented_{{getNewId}}">
					<button class="button button-outline">统计</button>
					<button class="button button-outline button-actives">签到签退</button>
					<button class="button button-outline">轨迹</button>
				</p>
			</div>
		</div>
		
		<!-- <div class="tb-phone" @click="tabkePhontos">
				<i class="iconfont icon-paizhao" style="font-size: 40px;"></i>
				<div style="margin-top: -10px;">拍照签到</div>
			</div> -->
			
			<!-- 签到签退 -->
		<div class="page-content" id="signIn_out">
	
		</div>
		<div id="upLoadImagesContainer">
			<div id="upLoadPickfilesSign"></div>
		</div>
		<div id="upLoadImagesContainerOut">
			<div id="upLoadPickfilesOut"></div>
		</div>
	
		<!-- 轨迹 -->
		<div class="trajectory" id="trajectory_locus">
	
		</div>
	
		<!-- 轨迹 -->
		<div class="statistics" id="statistics_census">
			
		</div>
	
	</div>
	</template>
	
	<script>
		return {
			mounted() {
				var self = this;
				var $ = self.$;
				if (single_Orgid == "") {
				  self.orgIds=userInfor.organizationIds;
				} else {
				  self.orgIds=single_Orgid;
				};
				self.strSignDate = moment().format("YYYY-MM-DD");
				self.strMonth = moment().format("YYYY-MM-DD");
				self.NowDay = moment().format("YYYY-MM-DD");
				self.getNowDay = moment().format("YYYY-MM")
				var yd = moment().format("YYYY-MM")
				var y = yd.toString().substr(0,4)
				var m = yd.toString().substr(5,6)
				var d = new Date(y,m,0).getDate()
				self.monthStart = y + "-" + m +"-01 00:00:00"
				self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
				self.startTime = self.strSignDate + " 00:00:00"
				self.endTime = self.strSignDate + " 23:59:59"
				self.trajectoryTitle = 0
				self.content = "",
				self.orgName = ""
			},
			data : function() {
				return {
					pageName:"signIn",
					radius: 0,      //联网单位打卡半径
					longitude: 0,   //联网单位经度 
					latitude: 0,    //联网单位纬度
					result: 1,
					userLongitude: 0,  //用户经度
					userLatitude:0,     // 用户纬度
					signOrg: "",
					selectOptionOrg: "",
					imageArr: [],
					getNewId: (new Date()).getTime(),
					titleIindex:1,
					address: "",
					signPicUrl:"",
					signUser:""
				}
			},
			methods : {
				backToRefresh:function(){
					var self = this;
					self.getNativeBackLocation();
				},
				// 人员分布 - loadData
				viewStaffDistrimap: function () {
					var self = this;
					Dao.getSignLastPoint({
						// signOrgIds: this.formInline_temp.orgIds || this.$store.state.userinfo.organizationIds,
						// queryType:1,
						// pageIndex: this.formInline_temp.currentPageIndex -1,
						// pageSize: this.formInline_temp.currentPageSize,
						// startTime:this.formInline_temp.time?this.formInline_temp.time[0]:'',
						// endTime: this.formInline_temp.time?this.formInline_temp.time[1]:'',
						// signUser: this.formInline_temp.signUser,
						// type: this.formInline_temp.type
						signOrgIds: self.selectOptionOrg,
						queryType:0,
						signUser:self.signUser,
						// startTime:self.startTime,
						endTime:self.endTime,
					}, function(res){
						if (res) {
							self.createMap_addMarker(res);// 创建地图 向地图中添加marker
						}
					})
				},
				// 人员轨迹 -loadData
				trajectroymap: function() {
					var self = this;
					Dao.getSignRecordGroupList({
						signOrgIds: self.selectOptionOrg,
						queryType:0,
						signUser:self.signUser ? self.signUser : userInfor.accountName,
						startTime:self.startTime,
						endTime:self.endTime,
					}, function(res){
						if (res) {
							self.initMap(res)
						}
					})
				},
				// 人员分布 - map
				createMap_addMarker: function(viewStaffDistributionData) {
					var self = this
					let map = new BMap.Map("createMap_addMarker_map", {enableMapClick:false,enableMap:false});//在百度地图容器中创建一个地图
					let point_create = new BMap.Point(viewStaffDistributionData.length!==0?viewStaffDistributionData[0].longitude: self.longitude,viewStaffDistributionData.length!==0?viewStaffDistributionData[0].latitude:self.latitude);//定义一个中心点坐标
					map.centerAndZoom(point_create,16);//设定地图的中心点和坐标并将地图显示在地图容器中
					window.map = map;//将map变量存储在全局
					map.enableScrollWheelZoom(true)
					if (viewStaffDistributionData.length ===0) {
						return
					}
					viewStaffDistributionData=self.toTree(viewStaffDistributionData)
					let point = new Array();//定义数组标注经纬信息
					let marker = new Array();//定义数组点对象信息
					for(let i = 0; i < viewStaffDistributionData.length; i++){//遍历
						let infoA = viewStaffDistributionData[i].longitude;
						let infoB = viewStaffDistributionData[i].latitude;
						let everywill_track = new BMap.Point(infoA,infoB);
						//创建用户头像标注
						let myIcon = new BMap.Icon(`${staticPath}img/SignLastPointIcon.png`, new BMap.Size(0, 0), // 视窗大小
						{
							// anchor: new BMap.Size(35,55),staticPath+'img/SignLastPointIcon.png'
							//imageSize: new BMap.Size(26, 32), // 引用图片实际大小
			　　　　　　　　　imageOffset:new BMap.Size(0,0)  // 图片相对视窗的偏移
						});
						let dutyMarker = new BMap.Marker(everywill_track,{icon:myIcon});  // 创建单位标注*/
						map.addOverlay(dutyMarker);  
						let start_signInDate = ""
						let strart_markerLabelScoreList = ""
						let signIn_signOut_height = 30
						signIn_signOut_height = signIn_signOut_height + viewStaffDistributionData[i].children.length*16
						// 单位气泡上多人名称
						for(let j=0;j<viewStaffDistributionData[i].children.length;j++){
							// 起始 签到签退时间
							start_signInDate = viewStaffDistributionData[i].children[j].signUserName
							strart_markerLabelScoreList+=`<p style='color: rgba(0, 0, 0, 0.8);font-weight: normal;font-size: 14px;'>`+ (start_signInDate) +`</p>`
						}
						let markerLabelScore = new BMap.Label(`<div class='viewStaffDistribution_baiduMark-dutys'><div class='viewStaffDistribution_baiduMark-duty'><div>` + strart_markerLabelScoreList + `</div></div></div>`,{
							offset:new BMap.Size(-30, -signIn_signOut_height),
							position:everywill_track,
						}); 
						
						markerLabelScore.setStyle({
							width: 'auto',
							height:'45px',
							color: '#fff',
							fontSize: '16px',
							backgroundColor: 'none',
							border: 'none',
							borderRadius:"4px",
							textAlign: "left",
							padding: "0px",
						});
						markerLabelScore.setZIndex(10000);
						map.addOverlay(markerLabelScore);
					}
				},
				// 人员轨迹 - map
				initMap: function(researchersTrackData) {
					let self = this
					// 百度地图API功能
					let map = new BMap.Map("trajectory_locus_map", {enableMapClick:false,enableMap:false});
					// 默认地图中心点为第一个单位
					let start_point_signInUserLng = researchersTrackData.length!==0?researchersTrackData[0].signOrgLongitude: self.longitude
					let start_point_signInUserLat = researchersTrackData.length!==0?researchersTrackData[0].signOrgLatitude: self.latitude
					let point = new BMap.Point(start_point_signInUserLng,start_point_signInUserLat);//定义一个中心点坐标
					map.centerAndZoom(point,16);//设定地图的中心点和坐标并将地图显示在地图容器中
					map.enableScrollWheelZoom(true);
	
					if (researchersTrackData.length ===0) {
						return
					}
					// 数据格式转换
					researchersTrackData = self.toTree(researchersTrackData)
					//循环单位和气泡 在地图上显示
					for(let i=0;i<researchersTrackData.length;i++){
						// 循环所有单位的经纬度
						let point_signInUserLng = researchersTrackData.length!==0?researchersTrackData[i].signOrgLongitude: self.longitude
						let point_signInUserLat = researchersTrackData.length!==0?researchersTrackData[i].signOrgLatitude: self.latitude
						let everywill_track = new BMap.Point(point_signInUserLng,point_signInUserLat);
						let start_m = new BMap.Marker(everywill_track); 
						// 单位图标（目前隐藏，不需要）
						let option_map = {imageOffset: new BMap.Size(0, 0),offset: new BMap.Size(0, 0),}
						start_m.setIcon(new BMap.Icon(`${staticPath}img/SignRecordIcon.png`,new BMap.Size(0, 0),option_map));
						map.addOverlay(start_m);
						// 多单位气泡位置和内容
						let strart_trackmarkerLabelScore = ""
						let strart_markerLabelScoreList = ""
						let start_signInDate = ""
						let start_signOutDate = ""
						let start_point_Arr = {}
						let signIn_signOut_height = 64
						signIn_signOut_height = signIn_signOut_height + researchersTrackData[i].children.length*16
						for(let j=0;j<researchersTrackData[i].children.length;j++){
							start_point_Arr = researchersTrackData[i].children?researchersTrackData[i].children[j]: {}
							// 起始 签到签退时间
							start_signInDate = start_point_Arr.signInDate === undefined||start_point_Arr.signInDate === null?'':'签到'+start_point_Arr.signInDate.substr(11,5)
							start_signOutDate = start_point_Arr.signOutDate === undefined||start_point_Arr.signOutDate === null?'': ' - 签退'+start_point_Arr.signOutDate.substr(11,5)
							strart_markerLabelScoreList+="<p style='color: rgba(0, 0, 0, 0.8);font-weight: normal;font-size: 14px;'>"+ (start_signInDate + start_signOutDate ) +"</p>"
						}
						strart_trackmarkerLabelScore = new BMap.Label(`<div id='pageContainer_start' class='researchersTrac_pop'> <div class='baiduMark-duty'>
								<div>
									<p class="channel-del" style='font-size:16px;padding-bottom: 9px;font-weight: blod;color:#000;'>`+(researchersTrackData[i].signOrgName || '')+`</p>
									<div> 
									</div>
									`+strart_markerLabelScoreList+`
								</div>
							</div></div>`,{
							offset:new BMap.Size(-107, -signIn_signOut_height),
							position: everywill_track
						});  
						strart_trackmarkerLabelScore.setStyle({
							width: '215px',
							height:'96px',
							color: '#fff',
							fontSize: '16px',
							backgroundColor: 'none',
							border: 'none',
							borderRadius:"4px",
							textAlign: "center",
							padding: "5px 5px",
							lineHeight: "15px"
						});
						map.addOverlay(strart_trackmarkerLabelScore); 
					}
					// 路线规划
					if (researchersTrackData.length > 1 ) {
						let strart_driving // 路线规划 起始点
						let end_driving; // 路线规划 终点
						let center_driving = [] // 路线规划 途径点
						// 路线规划 起始点
						let strart_driving_signInUserLng = researchersTrackData.length!==0?researchersTrackData[0].signOrgLongitude: self.longitude
						let strart_driving_signInUserLat = researchersTrackData.length!==0?researchersTrackData[0].signOrgLatitude: self.latitude
						strart_driving = new BMap.Point(strart_driving_signInUserLng,strart_driving_signInUserLat);
						// 路线规划 终点
						if (researchersTrackData.length >= 1 ) {
							let end_driving_signInUserLng = researchersTrackData.length!==0?researchersTrackData[researchersTrackData.length-1].signOrgLongitude: self.longitude
							let end_driving_signInUserLat = researchersTrackData.length!==0?researchersTrackData[researchersTrackData.length-1].signOrgLatitude: self.latitude
							end_driving = new BMap.Point(end_driving_signInUserLng,end_driving_signInUserLat);
						}
						// 路线规划 途径点
						if(researchersTrackData.length>=2){
							for(let i = 1; i<researchersTrackData.length-1;i++){
								let center_driving_signInUserLng = researchersTrackData.length!==0?researchersTrackData[i].signOrgLongitude: self.longitude
								let center_driving_signInUserLat = researchersTrackData.length!==0?researchersTrackData[i].signOrgLatitude: self.latitude
								center_driving.push(new BMap.Point(center_driving_signInUserLng,center_driving_signInUserLat));
							}
						}
						//行车路线规划 实例
						let driving = new BMap.DrivingRoute(map, { renderOptions:{ map: map, autoViewport: true},
							onPolylinesSet:function(Route){
								//当线条添加完成时调用
								for(let i=0;i<Route.length;i++){
										let polyline = Route[i].getPolyline();//获取线条遮挡物
											// polyline.setStrokeColor("#000");//设置颜色
											polyline.setStrokeWeight(5);//设置宽度
											polyline.setStrokeOpacity(1);//设置透明度
								}
							},onMarkersSet:function(routes) {
								//当地图标记添加完成时调用
								for (let i = 0; i <routes.length; i++) {
									map.removeOverlay(routes[i].marker); //删除起始终点默认图标
									map.removeOverlay(routes[i].Um); //删除途经默认图标
								}
							}
						});
						driving.enableAutoViewport(); // 自动调整层级
						driving.search(strart_driving, end_driving,{waypoints:center_driving});//waypoints表示途经点 
					}
				},
				toTree: function(tarArray){
					let self = this
					let newArr = self.deRepeat(tarArray)
					for(let i=0;i<newArr.length;i++){
						newArr[i].children = []
						for(let n=0;n<tarArray.length;n++){
							if(newArr[i].signOrg == tarArray[n].signOrg){
								newArr[i].children.push(tarArray[n])
							}
						}
					}
					return newArr
				},
				deRepeat: function(arr){
					let newArr = []
					let obj = {};
					arr = arr.reduce((item, next) => {
					if (!obj[next.signOrg]) {
						item.push(next);
						obj[next.signOrg] = true;
					}
					return item;
					}, []);
					return arr
				},
				// 签到签退主页 - map
				baiduMap: function() {
					var self = this;
					// 百度地图API功能
					var map = new BMap.Map("signInMap"); // 创建Map实例
					var point = new BMap.Point(self.userLongitude, self.userLatitude); //当前用户经纬度
					var pointCircle = new BMap.Point(self.longitude, self.latitude); //联网单位经纬度
					var circle = new BMap.Circle(pointCircle,self.radius,{strokeColor:"#F9BF26",fillColor:"#F9BF26", strokeWeight: 1 ,fillOpacity: 0.2, strokeOpacity: 0.2}); //创建圆
					var marker = new BMap.Circle(pointCircle,0,{strokeColor:"#F9BF26", strokeWeight:2}); //创建圆心点位置
					// 创建自己的定位图标和 气泡
					var myIcon = new BMap.Icon(`${staticPath}img/SignLastPointIcon.png`, new BMap.Size(0, 0), {
						// anchor: new BMap.Size(35,55),`${staticPath}img/SignLastPointIcon.png`
						imageOffset:new BMap.Size(0,0)  // 图片相对视窗的偏移
					});
					// 创建文本标注对象
					let label = new BMap.Label("<div class='unit-orgName'>"+self.address+"</div>",{
						offset:new BMap.Size(-30, -70),
						position:pointCircle,
					}); 
					// 自定义文本标注样式
					label.setStyle({
						color: '#000',
						padding: '10px',
						fontSize: '16px',
						height: '30px',
						lineHeight: '30px',
						fontFamily: '微软雅黑',
						border:"none",
						backgroundColor:"none",
					});
					map.addOverlay(label);
					var myIconMarker = new BMap.Marker(point,{icon:myIcon});  // 创建标注
					let markerLabelScore = new BMap.Label("<div class='baiduMark-duty baiduMark-dutys'>你</div>",{
						offset:new BMap.Size(-10, -50),
						position:point,
					});   
					markerLabelScore.setStyle({
						width: 'auto',
						height:'45px',
						color: '#fff',
						fontSize: '16px',
						backgroundColor: 'none',
						border: 'none',
						borderRadius:"4px",
						textAlign: "left",
						padding: "0px",
					});
					markerLabelScore.setZIndex(10000);
					map.addOverlay(markerLabelScore);  
					myIconMarker.setAnimation();
	
					map.centerAndZoom(point, 16);  // 初始化地图,设置中心点坐标和地图级别
					//添加覆盖物
					map.addOverlay(circle);            //增加圆
					map.addOverlay(marker);            //增加圆
					map.addOverlay(myIconMarker);       //将将标注添加到地图中
					
					
					map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
					
					var distance = (map.getDistance(point,pointCircle)).toFixed(2); // 用户与联网单位距离
					if (parseFloat(distance) > parseFloat(self.radius)) {  // 范围外
						self.result = 0;
						console.log ('您不在业主单位范围内', distance)
						// $(".tb-name").css("color","#E07762")
						//$(".tb-name").html("您不在业主单位范围内")
					} else {   // 范围内
						self.result = 1;
						console.log ('在业主单位范围内', distance)
						// $(".tb-name").css("color","#2471CA");
					}
					if(self.result == 0){
						setInterval(self.test,200);
						jQuery("#beyond_area_box").show()
						jQuery("#signOut_box").hide()
						jQuery("#signIn_box").hide()
					}else{
						Dao.getSignRecordGroupList({
							signOrgIds: userInfor.organizationIds,
							queryType:0,
							signUser:userInfor.accountName
						}, function(res){
							if(res.length!==0?true:false) {
								if(res[0].signOutDate && self.signOrg == res[0].signOrg){
									// 签到
									jQuery("#beyond_area_box").hide()
									jQuery("#signOut_box").hide()
									jQuery("#signIn_box").show()
									jQuery(".page-content #signIn_box .sign-nfc").show()
									jQuery(".page-content #signIn_box .sign-nfcs").hide()
								}else{
									if(self.signOrg != res[0].signOrg){
										// 签到
										jQuery("#beyond_area_box").hide()
										jQuery("#signOut_box").hide()
										jQuery("#signIn_box").show()
										jQuery(".page-content #signIn_box .sign-nfc").show()
										jQuery(".page-content #signIn_box .sign-nfcs").hide()
									}else{
										// 签退
										jQuery("#beyond_area_box").hide()
										jQuery("#signOut_box").show()
										jQuery("#signIn_box").hide()
										jQuery(".page-content #signOut_box .sign-nfc").show()
										jQuery(".page-content #signOut_box .sign-nfcs").hide()
									}
								}
							} else {
								// 签到
								jQuery("#beyond_area_box").hide()
								jQuery("#signOut_box").hide()
								jQuery("#signIn_box").show()
								jQuery(".page-content #signIn_box .sign-nfc").show()
								jQuery(".page-content #signIn_box .sign-nfcs").hide()
							}
					})
						setInterval(() => {
							let myDate = new Date()
							let house = myDate.getHours()<10 ? "0"+myDate.getHours() : myDate.getHours(); //获取系统时，
							let minute = myDate.getMinutes()<10 ? "0"+myDate.getMinutes() : myDate.getMinutes(); //分
							let second = myDate.getSeconds()<10 ? "0"+myDate.getSeconds() : myDate.getSeconds(); //秒
							let timeNow = house+":"+minute+":"+second
							jQuery("#signIn_out #time").html(timeNow)
						}, 1000);
	
					}
				},
				htmlPage: function() {
					var self = this;
					var $ = self.$$;
					Dao.getNearestOrgByLocation({
						orgIds:userInfor.organizationIds,
						longitude:self.userLongitude || 0,
						latitude: self.userLatitude || 0
					},function(data) {
						self.longitude = data.longitude;
						self.latitude = data.latitude;
						self.radius = data.radius || 80;
						self.signOrg = data.organizationId;
						self.address = data.name
						jQuery("#signIn .orientation").html("定位单位："+data.name)
						jQuery("#signOut .orientation").html("定位单位："+data.name)
						//$("#orgLocation").html("位置："+data.address);
						self.baiduMap();
						// self.getData()
						if(self.result == 0) {
							// $(".tb-name").css("color","#E07762")
							// $(".tb-name").html(data.name);
							//$(".tb-name").html("您不在业主单位范围内")
						} else { 
							// $(".tb-name").html(data.name);	
						}
					},true);
					
					//选择单位
					 jQuery("#changeOrg").off().click(function() {
						 loadSelectUnitFunc(function(data) {
							 if(self.signOrg != data.orgId) {
								 self.radius = data.radius;
								 self.longitude = data.longitude;
								 self.latitude = data.latitude;
								 self.signOrg = data.orgId;
								 self.orgName = data.orgName
								 $(".tb-name").html(data.orgName);
								  //$("#orgLocation").html("位置："+ data.address);
								 jQuery("#changeOrg").addClass('select-active');
							 } else {
								 self.signOrg = "";
								 if (single_Orgid == "") {
									 self.orgIds=userInfor.organizationIds;
								 } else {
									 self.orgIds=single_Orgid;
								 }
								 jQuery("#changeOrg").removeClass("select-active");
							 }
							 self.baiduMap();
						 },self.signOrg);
					 });
					 
					 if(userInfor.isMuilUnitUser == 0) { //单
						 self.orgIds=userInfor.organizationIds;
						 jQuery("#changeOrg").hide();
					 } else {
						 if (single_Orgid == "") {
							self.orgIds=userInfor.organizationIds;
						} else {
							self.orgIds=single_Orgid;
						}
						 jQuery("#changeOrg").show();
					 }
				},
				getData: function(){
					let self = this
					if(self.titleIindex == 1){
						// 签到签退
						self.signInSignOff()
						self.htmlPage();
						// jQuery("#signIn_out").show()
					}
					
				},
				genClick: function(){
					let self = this
					jQuery("#segmented_" + this.getNewId + " .button.button-outline").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives");
						self.titleIindex = jQuery(this).index()
						if(self.titleIindex == 1){
							// 签到签退
							self.selectOptionOrg = userInfor.organizationIds
							self.selectOptionOrg = userInfor.organizationIds
							self.signUser = userInfor.accountName
							self.startTime = self.NowDay + " 00:00:00"
							self.endTime = self.NowDay + " 23:59:59"
							self.trajectoryTitle = 0
							self.signInSignOff()
							native.requestLocation();   
							self.htmlPage();
							jQuery("#trajectory_locus").hide()
							jQuery("#signIn_out").show()
							jQuery("#statistics_census").hide()
							// jQuery("#signIn_out").show()
						}else if(self.titleIindex == 0){
							// 统计
							self.selectOptionOrg = userInfor.organizationIds
							self.signUser = userInfor.accountName
							self.startTime = self.NowDay + " 00:00:00"
							self.endTime = self.NowDay + " 23:59:59"
							self.statisticsCensus()
							self.getMonthSignDetail()
							self.getSignDetail()
							jQuery("#signIn_out").hide()
							jQuery("#trajectory_locus").hide()
							jQuery("#statistics_census").show()
						}else if(self.titleIindex == 2){
							// 轨迹
							self.selectOptionOrg = userInfor.organizationIds
							self.signUser = userInfor.accountName
							self.startTime = self.NowDay + " 00:00:00"
							self.endTime = self.NowDay + " 23:59:59"
							self.getTrajectory()
							jQuery("#signIn_out").hide()
							jQuery("#trajectory_locus").show()
							jQuery("#statistics_census").hide()
						}
					})
				},
				// 统计
				statisticsCensus:function(){
					let self = this
					jQuery("#statistics_census").empty()
					jQuery("#statistics_census").append(`
						<p class="segmented statistics-census" id="segmented_statistics">
							<button class="button button-outline button-actives">我的统计</button>
							<button class="button button-outline">团队统计</button>
						</p>
						<div class="statistics-census-check" style="display:none;">
							<div class="statistics-personnel">
								<span class="search-left">签到业主单位</span>
								<p class="segmented" id="segmented_trajectoryss">
									<button class="button button-outline button-actives">全部</button>
									<button class="button button-outline">单个</button>
								</p>
							</div>
							<div id="search_unit_signIn" class="search-unit-sign" style="display:none;">
								<span class="search-left">业主单位</span>
								<p>
									<span class="search-date-detail">请选择</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
							<div class="statistics-date">
								<span class="search-left">查询人员</span>
								<p class="segmented" id="segmented_trajectorys">
									<button class="button button-outline button-actives">全员</button>
									<button class="button button-outline">人员</button>
								</p>
							</div>
							<div id="search_people" class="search-people" style="display:none;">
								<span class="search-left">人员</span>
								<p>
									<span class="search-date-detail">请选择</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
						</div>
						<div class="signIn-signOut-system">
								<div><span id="signIn_number"></span><span>签到次数</span></div>
								<div><span id="signOut_number"></span><span>签退次数</span></div>
								<!-- <div><span id="signIn_system_number"></span><span>系统补签到</span></div> -->
								<div><span id="signOut_system_number"></span><span>系统补签退</span></div>
							</div>
						<div id="signCalender"></div>
						<div id="month_signIn_signOut_p"></div>
						<div class="month-signIn-signOut" id="month_signIn_signOut">
							
						</div>
					`)
					self.getTimeDetail()
					self.getSignStatistics()
					self.getSignStatisticsDetail()
					self.checkCensus()
					self.getPeopleUnit();
				},
				// 获取日历
				getTimeDetail: function(){
					let self = this
					jQuery("#signCalender").empty()
					var monthNames = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月' , '9月' , '10月', '11月', '12月'];
					var monthNums = ['01','02','03','04','05','06','07','08','09','10','11','12']; 
					var calendarInline = app.calendar.create({
						containerEl: '#signCalender',
						value: [new Date()],
						weekHeader: false,
						renderToolbar: function () {
							return '<div class="toolbar calendar-custom-toolbar no-shadow">' +
							'<div class="toolbar-inner">' +
								'<div class="left">' +
								'<a href="#" class="link icon-only"><i class="icon icon-back ' + (app.theme === 'md' ? 'color-black' : '') + '"></i></a>' +
								'</div>' +
								'<div class="center"></div>' +
								'<div class="right">' +
								'<a href="#" class="link icon-only"><i class="icon icon-forward ' + (app.theme === 'md' ? 'color-black' : '') + '"></i></a>' +
								'</div>' +
								
							'</div>' +
							
							
							'<div class="week-title"><span>一</span><span>二</span><span>三</span><span>四</span><span>五</span><span>六</span><span>日</span></div>' +
							'</div>';
						},
						on: {
							init: function (c) {
								$(".calendar-day-today").append(`<div class="icon-today">
									<i class="iconfont icon-jintian-"></i></div>`);
								$('.calendar-custom-toolbar .center').text(c.currentYear + '年' + monthNames[c.currentMonth]+'汇总');
								$('.calendar-custom-toolbar .left .link').on('click', function () {
									calendarInline.prevMonth();
									var y = c.currentYear;
									var m = c.params.monthNames[c.currentMonth];
									var d = new Date(y,m,0).getDate()
									self.monthStart = y + "-" + m +"-01 00:00:00"
									self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
									self.getSignStatistics()
									self.getSignDetail()
								});
								$('.calendar-custom-toolbar .right .link').on('click', function () {
									calendarInline.nextMonth();
									var y = c.currentYear;
									var m = c.params.monthNames[c.currentMonth];
									var d = new Date(y,m,0).getDate()
									self.monthStart = y + "-" + m +"-01 00:00:00"
									self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
									self.getSignStatistics()
									self.getSignDetail()
								});
							},
							monthYearChangeStart: function (c) {
								$('.calendar-custom-toolbar .center').text(c.currentYear + '年' + monthNames[c.currentMonth]+'汇总');
								self.strMonth = c.currentYear + '-' + monthNums[c.currentMonth] + '-01';
								
								self.getMonthSignDetail();
								var y = c.currentYear;
								var m = c.params.monthNames[c.currentMonth];
								var d = new Date(y,m,0).getDate()
								self.monthStart = y + "-" + m +"-01 00:00:00"
								self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
								self.getSignStatistics()
							},
							calendarDayClick:function (c,value) {
								var y = c.currentYear;
								var m = c.params.monthNames[c.currentMonth];
								var day = $(value).attr("data-day");
								day = parseInt(day) < 10 ? ('0'+day) : day;
								self.startTime = y + "-" + m +"-" + day + " 00:00:00";
								self.endTime = y + "-" + m +"-" + day + " 23:59:59";
								self.strSignDate = y + "-" + m + "-" + day;
								// $("#inspectionTitle").html( y + "-" + m +"-" + day + "&nbsp;&nbsp;&nbsp;共查岗<span style='color:#397FCF;padding:0 8px;' id='inspectionTotal'>0</span>次");
								
								self.getSignStatisticsDetail()
								
								// self.getSignDetail();
							}
						}
					});
				},
				// 筛选条件
				getPeopleUnit: function(){
					let self = this
					jQuery("#statistics_census").off("click").on("click","#search_unit_signIn",function(){
						loadSelectUnitFunc(function(data){
							//选中
							if(self.selectOptionOrg != data.orgId){
								self.selectOptionOrg = data.orgId;
								// self.orgIds=data.orgId;
								// self.signUser = data.name
								jQuery("#statistics_census #search_unit_signIn .search-date-detail").html(data.orgName);
							} else {
								self.selectOptionOrg = "";
								self.orgIds=userInfor.organizationIds;
								self.signUser = ""
								jQuery("#select_hidden_org #search_unit_signIn .search-date-detail").html("请选择");
							}
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
							
						});
					})
	
					jQuery("#statistics_census #search_people").off("click").on("click",function(){
						let selectOptionIndex1 = null
						let selectOptionType = null
						if (jQuery("#statistics_census #search_unit_signIn .search-date-detail").text() == "请选择") {
							app.methods.showToastCenter('请先选择业主单位');
						} else {
							getFourTypeUser(self.selectOptionOrg, function (data) {
								// self.selectOptionOrg = data.id
								self.signUser = data.index
								jQuery("#statistics_census #search_people .search-date-detail").html(data.name)
								if (selectOptionIndex1 != data.index) {
									selectOptionIndex1 = data.index;
									selectOptionType = data.type;
								} else {
									selectOptionIndex1 = "";
									selectOptionType = 1;
								}
								self.getTimeDetail()
								self.getSignStatistics()
								self.getSignDetail()
								self.getMonthSignDetail()
								self.getSignStatisticsDetail()
								
							}, selectOptionIndex1, selectOptionType,true);
						}
					})
				},
				// 获取每天签到签退详情
				getSignStatisticsDetail: function(){
					let self = this
					Dao.getSignRecordList({
						queryType:0,
						startTime:self.startTime,
						endTime:self.endTime,
						signOrgIds: self.selectOptionOrg,
						signUser: self.signUser,
					},function(res){
						if(res.length>0){
							jQuery("#month_signIn_signOut").empty()
							let str = self.strSignDate.split("-")
							jQuery("#month_signIn_signOut_p").empty()
							jQuery("#month_signIn_signOut_p").append('<p class="signIn-signOut-everyDay">'+str[0]+'年'+str[1]+'月'+str[2]+'日'+'签到签退明细</p>')
							jQuery("#month_signIn_signOut").addClass("month-signIn-signOut")
							for(let i=0;i<res.length;i++){
								jQuery("#month_signIn_signOut").append(`
								<div>
									<div class="signPicUrl-img" id="signPicUrl_img_`+res[i].id+`">
									</div>
									<div>
										<p class="sign-user-name" style="display:none;">`+res[i].signUserName+`</p>
										<p><img src="${staticPath}img/single-top/signIn_signOut_time.png" /><span>`+res[i].signDate.toString().substr(10,6)+`</span></p>	
										<p class="signOrgName-sign-`+res[i].id+`"></p>	
									</div>
								</div>
								`);
								if(res[i].signPicUrl!=''||res[i].signPicUrl==null||res[i].signPicUrl==undefined){
									showImage(jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id),res[i].signPicUrl,1);
								}else{
									jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id).append(`
									<img class="image-item" />`);
								}
								if(res[i].dataType == 1 && res[i].type == 1){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"签到")
								}else if(res[i].dataType == 1 && res[i].type == 2){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"签退")
								}else if(res[i].dataType == 2 && res[i].type == 1){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"由系统补签到")
									jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id).find(".image-item").attr("src",`${staticPath}img/single-top/system_signIn_signOut.png`)
								}else if(res[i].dataType == 2 && res[i].type == 2){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"由系统补签退")
									jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id).find(".image-item").attr("src",`${staticPath}img/single-top/system_signIn_signOut.png`)
								}
	
								if(res[i].signNfc && res[i].type == 1){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"签到")
									jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id).find(".image-item").attr("src",`${staticPath}img/single-top/nfc_signIn_signOut.png`)
								}else if(res[i].signNfc && res[i].type == 2){
									jQuery("#month_signIn_signOut .signOrgName-sign-"+res[i].id).html("在"+res[i].signOrgName+"签退")
									jQuery("#month_signIn_signOut #signPicUrl_img_"+res[i].id).find(".image-item").attr("src",`${staticPath}img/single-top/nfc_signIn_signOut.png`)
								}
								
							}
							if(self.trajectoryTitle == 0){
								jQuery(".sign-user-name").hide()
							}else{
								jQuery(".sign-user-name").show()
							}
						}else{
							jQuery("#month_signIn_signOut_p").empty()
							jQuery("#month_signIn_signOut").empty()
							jQuery("#month_signIn_signOut").removeClass("month-signIn-signOut")
						}
					})
				},
				// 获取签到统计
				getSignStatistics:function(){
					let self = this
					Dao.getSignStatistics({
						startTime:self.monthStart,
						endTime:self.monthEnd,
						signOrgIds: self.selectOptionOrg,
						signUser: self.signUser,
					},function(res){
						jQuery("#signIn_number").html(res.signInNum)
						jQuery("#signOut_number").html(res.signOutNum - res.signOutsysNum)
						jQuery("#signIn_system_number").html(res.signInsysNum)
						jQuery("#signOut_system_number").html(res.signOutsysNum)
					})
				},
				//获取签到明细
				getSignDetail:function() {
					var self = this;
					var orgLocation = self.$route.params.orgLocation;
					Dao.getSignDetail({
						// signUser: self.singePeople!=0?self.singePeople:userInfor.accountName,
						signOrgIds: self.selectOptionOrg,
						signUser: self.signUser,
						strSignDate: self.strSignDate
					}, function(data){
						if(self.pageIndex==0){
							$("#recordTime").empty();
						}
						if(data && data.length>0) {
							for(var i=0;i<data.length;i++) {
								var str = '<div class="timeline-item">'
									+'<div class="timeline-item-date">'+data[i].signDate.split(' ')[1]+'</div>'
									+'<div style="text-align: center;">'
									+'<i class="iconfont icon-APPicon_dingwei" style="color: #2471CA;"></i>'
									+'<div class="timeline-item-divider" style="height: 0px; margin-top: 0px;"></div>'
									+'</div><div class="timeline-item-content">'
									+'<div class="timeline-item-title">'+ data[i].signOrgName +'</div>'
									+'<div class="check-content"><div class="main-content"><div style="padding:15px 15px 0px 15px;height: 120px">'
									+ '<img src="'+picNo(data[i].signPicUrl)+'"></div>'
									+'<div class="check-info"><div class="tb-info">'
									+'<span class="tb-name">'+data[i].signOrgName+'</span></div>'
									+'<div style="padding-top: 8px;cursor: pointer;" id="openMap_'+data[i].id+'">'
									+ '<input type="hidden" data-name="userLongitude" value="'+data[i].userLongitude+'">'
									+'<input type="hidden" data-name="userLatitude" value="'+data[i].userLatitude+'">'
									+'<input type="hidden" data-name="longitude" value="'+data[i].longitude+'">'
									+'<input type="hidden" data-name="latitude" value="'+data[i].latitude+'">'
									+'<input type="hidden" data-name="radius" value="'+data[i].radius+'">';
							 if(data[i].result == "1") { //范围内
								 str += '<span style="color:#69BA71;font-size:12px">范围内签到</span>';
							 } 
							 if(data[i].result == "0") { //范围外
								 str += '<span style="color:#E07762;font-size:12px">超出范围签到</span>'; 
								}
								str	+= '<span style="float: right;">'
									+'<i class="iconfont icon-jiantou"></i></span></div></div></div></div></div>'; 
								$("#recordTime").empty()
								$("#recordTime").append(str);
	
								jQuery("#openMap_"+data[i].id).click(function() {
								
								var userLongitude = this.children[0].value;
								var userLatitude = this.children[1].value;
								var longitude = this.children[2].value;
								var latitude = this.children[3].value;
								var radius = this.children[4].value;
								
								if(localStorage.getItem("rdsp_search_records")){
									
									jQuery(".rdsp-org-popup-top").show();
								}else {
									jQuery(".rdsp-org-popup-top").hide();
								}
								var html = `<div><div id="lookMap" class="check-map" style="height:230px;"></div></div>`;
								   openLayer(html,(el)=>{ });
								   
								   jQuery(".layui-m-layercont").addClass("layui-map");
							   });
							}
							
							
							
							
						} else {  // 无数据
							$("#recordTime").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
						}
					});
				},
				//获取当月签到时间
				getMonthSignDetail: function() {
					var self = this;
					var $ = self.$;
					Dao.getMonthSignDetail({
						strSignDate: self.strMonth?self.strMonth:self.strSignDate,
						signUser: self.signUser,
						orgIds: self.selectOptionOrg,
					}, function(data){
						if(data.length > 0) {  // data[i]签到时间
							for(var i=0;i < data.length;i++) {
							   var date = data[i];
							   //日历中的小圆点
							   var y,m,d;
							   y = date.toString().substring(0,4);
							   if(date.toString().substring(5,6) == '0') {
								  m = date.toString().substring(6,7);  
							   } else {
								  m = date.toString().substring(5,7);
							   }
							   if (date.toString().substring(8,9) == '0') {
								 d = date.toString().substring(9,10);
							   } else {
								 d = date.toString().substring(8,10);
							   }
								var attrValue = y + '-' + (m - 1) + '-' + d;
								$("#signCalender").find(".calendar-row div[data-date='"+attrValue+"'] span").removeClass("calendarDay normalColor")
								   $("#signCalender").find(".calendar-row div[data-date='"+attrValue+"'] span").addClass("calendarDay normalColor");
							}
						} 
					}, true);
				},
				// 切换
				checkCensus: function(){
					let self = this
					// 我的统计 - 团队统计切换
					jQuery("#segmented_statistics button").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						self.trajectoryTitle = trajectoryTitle
						if(trajectoryTitle == 0){
							self.selectOptionOrg = userInfor.organizationIds
							self.signUser = userInfor.accountName
							var yd = moment().format("YYYY-MM")
							var y = yd.toString().substr(0,4)
							var m = yd.toString().substr(5,6)
							var d = new Date(y,m,0).getDate()
							self.monthStart = y + "-" + m +"-01 00:00:00"
							self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
							var nowTime = moment().format("YYYY-MM-DD")
							self.startTime = nowTime + " 00:00:00"
							self.endTime = nowTime + " 23:59:59"
							self.strMonth = moment().format("YYYY-MM-DD")
							jQuery(".statistics-census-check").hide()
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
						}else{
							var yd = moment().format("YYYY-MM")
							var y = yd.toString().substr(0,4)
							var m = yd.toString().substr(5,6)
							var d = new Date(y,m,0).getDate()
							self.monthStart = y + "-" + m +"-01 00:00:00"
							self.monthEnd = y + "-" + m +"-" + d + " 23:59:59"
							var nowTime = moment().format("YYYY-MM-DD")
							self.startTime = nowTime + " 00:00:00"
							self.endTime = nowTime + " 23:59:59"
							self.strMonth = moment().format("YYYY-MM-DD")
							self.selectOptionOrg = ""
							self.signUser = ""
							jQuery(".statistics-census-check").show()
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
							jQuery("#segmented_trajectoryss button").removeClass("button-actives").first().addClass("button-actives")
							jQuery("#segmented_trajectorys button").removeClass("button-actives").first().addClass("button-actives")
							jQuery("#search_unit_signIn").hide()
							jQuery("#search_people").hide()
							jQuery("#search_unit_signIn .search-date-detail").html("请选择")
							jQuery("#search_people .search-date-detail").html("请选择")
						}
					})
					// 团队统计 - 签到业主单位切换
					jQuery("#segmented_trajectorys button").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						var nowTime = moment().format("YYYY-MM-DD")
						self.startTime = nowTime + " 00:00:00"
						self.endTime = nowTime + " 23:59:59"
						if(trajectoryTitle == 0){
							jQuery("#search_people").hide()
							// jQuery("#search_unit_signIn .search-date-detail").html("请选择")
							// self.selectOptionOrg = ""
							self.signUser = ""
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
						}else{
							jQuery("#search_people").show()
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
							jQuery("#search_people .search-date-detail").html("请选择")
						}
					})
					// 团队统计 - 查询人员切换
					jQuery("#segmented_trajectoryss button").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						var nowTime = moment().format("YYYY-MM-DD")
						self.startTime = nowTime + " 00:00:00"
						self.endTime = nowTime + " 23:59:59"
						if(trajectoryTitle == 0){
							jQuery("#statistics_census .search-unit-sign .search-date-detail").html("请选择")
							jQuery("#search_unit_signIn").hide()
							self.getTimeDetail()
							self.signOrgIds = ""
							self.selectOptionOrg = ""
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
						}else{
							jQuery("#search_unit_signIn").show()
							self.getTimeDetail()
							self.getSignStatistics()
							self.getSignDetail()
							self.getMonthSignDetail()
							self.getSignStatisticsDetail()
						}
					})
				},
				// 轨迹图
				getTrajectory: function(){
					let self = this
					let nowTimeStr = moment().format("YYYY-MM-DD HH:mm")
					jQuery("#trajectory_locus").empty()
					jQuery("#trajectory_locus").append(`
					<!-- 轨迹图 -->
					<div class="trajectory-map" id="trajectory_locus_map">
	
					</div>
					<div class="trajectory-map" id="createMap_addMarker_map" style="display: none">
	
					</div>
					<div class="trajectory-screen">
						<p class="segmented" id="segmented_trajectory">
							<button class="button button-outline button-actives">查看人员轨迹</button>
							<button class="button button-outline">查看人员分布</button>
						</p>
						<div class="trajectory-screen-tc">
							<div class="search-date">
								<span class="search-left">查询日期</span>
								<p>
									<span class="search-date-detail" id="search_date_detail">`+self.strSignDate+`</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
							<div class="search-personnel">
								<span class="search-left">查询人员</span>
								<p>
									<span class="search-personnel-detail">`+userInfor.name+`</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
						</div>
	
						<div class="trajectory-history-tc" style="display:none;">
							<div class="search-date">
								<span class="search-left">查询时间点</span>
								<p class="segmenteds" id="segmenteds_trajectorys">
									<button class="button button-outline button-actives">当前</button>
									<button class="button button-outline">历史</button>
								</p>
							</div>
							<div class="search-dates" style="display:none;">
								<span class="search-left">选择历史时间</span>
								<p>
									<span class="search-date-detail" id="search_date_detail">`+nowTimeStr.toString()+`</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
							<div class="search-personnel">
								<span class="search-left">查询人员</span>
								<p class="segmenteds" id="segmenteds_trajectoryss">
									<button class="button button-outline button-actives">全员</button>
									<button class="button button-outline">人员</button>
								</p>
							</div>
							<div class="search-personnels" style="display:none;">
								<span class="search-left">人员</span>
								<p>
									<span class="search-personnel-detail">`+userInfor.name+`</span>
									<img src="${staticPath}img/single-top/right_sign.png" />
								</p>
							</div>
						</div>
					</div>
					`)
					self.checkTrajectory()
					self.trajectroymap()
				},
				// 必要的切换以及切换事件
				checkTrajectory:function(){
					let self = this
					jQuery("#segmented_trajectory button").off("click").on("click",function(){
						let nowTimeStr = moment().format("YYYY-MM-DD HH:mm")
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						if(trajectoryTitle == 0){
							jQuery(".trajectory-history-tc").hide()
							jQuery(".trajectory-screen-tc").show()
							jQuery("#createMap_addMarker_map").hide()
							jQuery("#trajectory_locus_map").show()
							self.startTime = self.NowDay+" 00:00:00"
							self.endTime = self.NowDay+" 23:59:59"
							self.selectOptionOrg = ""
							self.signUser = userInfor.accountName
							jQuery("#trajectory_locus .trajectory-screen .trajectory-screen-tc .search-date-detail").html(self.NowDay)
							jQuery("#trajectory_locus .trajectory-screen .trajectory-screen-tc .search-personnel-detail").html(userInfor.name)
							self.trajectroymap()
						}else if(trajectoryTitle == 1){
							jQuery(".trajectory-history-tc").show()
							jQuery(".trajectory-screen-tc").hide()
							jQuery("#createMap_addMarker_map").show()
							jQuery("#trajectory_locus_map").hide()
							jQuery(".search-personnels").hide()
							jQuery(".search-dates").hide()
							jQuery("#segmenteds_trajectorys button").removeClass("button-actives")
							jQuery("#segmenteds_trajectoryss button").removeClass("button-actives")
							jQuery("#segmenteds_trajectorys").children(":first").addClass("button-actives")
							jQuery("#segmenteds_trajectoryss").children(":first").addClass("button-actives")
							self.startTime = nowTimeStr+":00"
							self.endTime = nowTimeStr+":59"
							self.signUser = ""
							self.selectOptionOrg = ""
							jQuery("#trajectory_locus .search-dates .search-date-detail").html(nowTimeStr)
							jQuery("#trajectory_locus .search-personnels .search-personnel-detail").html(userInfor.name)
							self.viewStaffDistrimap()
						}
					})
					// 查询人员分布 - 切换时间点
					jQuery("#segmenteds_trajectorys button").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						if(trajectoryTitle == 0){
							jQuery("#trajectory_locus .trajectory-history-tc .search-dates").hide()
							self.viewStaffDistrimap()
						}else if(trajectoryTitle == 1){
							jQuery("#trajectory_locus .trajectory-history-tc .search-dates").show()
						}
						
					})
					// 查询人员分布 - 切换人员
					jQuery("#segmenteds_trajectoryss button").off("click").on("click",function(){
						jQuery(this).addClass("button-actives").siblings().removeClass("button-actives")
						let trajectoryTitle = jQuery(this).index()
						if(trajectoryTitle == 0){
							jQuery("#trajectory_locus .trajectory-history-tc .search-personnels").hide()
							self.signUser = ""
							self.viewStaffDistrimap()
						}else if(trajectoryTitle == 1){
							jQuery("#trajectory_locus .trajectory-history-tc .search-personnels").show()
							self.signUser = userInfor.accountName
							self.viewStaffDistrimap()
						}
					})
					// 查询人员分布 - 选择历史时间
					jQuery("#trajectory_locus .trajectory-history-tc .search-dates").off("click").on("click",function(){
						loadSelectedDate_Fn(1,function(data){
							console.log(data)
							jQuery(".trajectory-history-tc .search-dates #search_date_detail").html(data.singleDate.substring(0,17))
							self.startTime = data.singleDate
							self.endTime = data.singleDate.substring(0,18)+"59"
							self.viewStaffDistrimap()
						})
					})
					// 查询人员分布 - 查询人员
					jQuery("#trajectory_locus .trajectory-history-tc .search-personnels").off("click").on("click",function(){
						let selectOptionIndex1 = null
						let selectOptionType = null
						self.selectOptionOrg = userInfor.organizationIds
						getFourTypeUser(self.selectOptionOrg, function (data) {
							self.signUser = data.index
							jQuery("#trajectory_locus .trajectory-history-tc .search-personnels .search-personnel-detail").html(data.name)
							if (selectOptionIndex1 != data.index) {
								selectOptionIndex1 = data.index;
								selectOptionType = data.type;
							} else {
								selectOptionIndex1 = "";
								selectOptionType = 1;
							}
							self.viewStaffDistrimap()
						}, selectOptionIndex1, selectOptionType,true);
					})
					// 查询人员轨迹 - 查询时间
					jQuery("#trajectory_locus .trajectory-screen-tc .search-date").off("click").on("click",function(){
						// var self = this;
						loadSelectedDate_Fn(5,function(data){
							jQuery("#trajectory_locus #search_date_detail").html(data.singleDate)
							self.startTime = data.singleDate + " 00:00:00"
							self.endTime = data.singleDate + " 23:59:59"
							self.trajectroymap()
						})
							
					})
					// 查询人员轨迹 - 查询人员
					jQuery("#trajectory_locus .trajectory-screen-tc .search-personnel").off("click").on("click",function(){
						let selectOptionIndex1 = null
						let selectOptionType = null
						self.selectOptionOrg = userInfor.organizationIds
						getFourTypeUser(self.selectOptionOrg, function (data) {
							// self.selectOptionOrg = data.orgId
							self.signUser = data.index
							jQuery("#trajectory_locus .trajectory-screen-tc .search-personnel .search-personnel-detail").html(data.name)
							if (selectOptionIndex1 != data.index) {
								selectOptionIndex1 = data.index;
								selectOptionType = data.type;
							} else {
								selectOptionIndex1 = "";
								selectOptionType = 1;
							}
							self.trajectroymap()
						}, selectOptionIndex1, selectOptionType);
					})
				},
				signInSignOff:function(){
					let self = this
					jQuery("#signIn_out").empty()
					jQuery("#signIn_out").append(`
					<!-- 签到签退 -->
					<div class="check-content" id="signIn_signOff">
						<div class="main-content" style="margin: 0;">
							<div>
								<div id="signInMap" class="check-map"></div>
							</div>
							<div class="flex-tabkePhontos">
								<!-- 不在范围 -->
								<div id="beyond_area_box" style="display:none;">
									<div class="beyond-area">
										<img id="not_in_scope" src="${staticPath}img/notInScope/not_in_scope.png" class="not-in-scope-imgTop" />
										<img id="imgTopBack" src="${staticPath}img/notInScope/imgTopBack.png" />
									</div>
									<div id="outOfRange" class="flex-bottom">
										<p class="not-in-scope">您当前不在业主范围内</p>
										<p class="not-in-scope-click"> <span id="refurbish" class="refurbish"><span>刷新定位</span></span></p>
									</div>
								</div>
								<!-- 签到 -->
								<div id="signIn_box" class="signIn-box-flex" style="display:none;">
									<div class="sign-nfc">
										<div class="signIn-box" id="photograph_signIn_take">
											<p class="photograph-signIn" id="photograph_signIn">拍照签到</p>
											<p class="photograph-signIn-time" id="time"></p>
										</div>
										<p id="nfc_signIn_take">NFC签到</p>
									</div>
									<div class="sign-nfcs" style="display:none">
										<div class="signIn-box" style="background:linear-gradient(#47cfad 0%, #4ddda9 100%);">
											<img src="${staticPath}img/single-top/signIn_wright.png" style="width: 56px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);" />
										</div>
										<p style="color:#47CFAD;margin: 10px 0;border: none;">签到成功，记得回来签退哦！<span id="signIn_success">5</span><span>秒</span> ~</p>
									</div>
									<div id="signIn" class="flex-bottom">
										<p class="orientation">您当前不在业主范围内</p>
										<p class="not-in-scope-click"> <span id="refurbish" class="refurbish"><span>刷新定位</span></span></p>
									</div>
								</div>
								<!-- 签退 -->
								<div id="signOut_box" class="signOut-box-flex" style="display:none;">
									<div class="sign-nfc">
										<div class="signOut-box" id="photograph_signOut_take">
											<p class="photograph-signOut" id="photograph_signIn">拍照签退</p>
											<p class="photograph-signOut-time" id="time"></p>
										</div>
										<p id="nfc_signOut_take">NFC签退</p>
									</div>
									<div class="sign-nfcs" style="display:none">
										<div class="signOut-box" style="background:linear-gradient(#47cfad 0%, #4ddda9 100%);">
											<img src="${staticPath}img/single-top/signIn_wright.png" style="width: 56px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);" />
										</div>
										<p style="color:#47CFAD;margin: 10px 0;border: none;">签退成功 <span id="signOut_success">5</span><span>秒</span> ~</p>
									</div>
									<div id="signOut" class="flex-bottom">
										<p class="orientation">您当前不在业主范围内</p>
										<p class="not-in-scope-click"> <span id="refurbish" class="refurbish"><span>刷新定位</span></span></p>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="sign-record">
						<p></p>
						<div class="timeline-box" id="timeline">
							
						</div>
					</div>`)
					jQuery("#signIn_out #refurbish").off("click").on("click",function(){
						self.htmlPage();
					}) 
					// self.htmlPage();
					native.requestLocation(); 
					// 获取签到记录
					self.signInRecord()
					// 签到
					jQuery(".page-content #signIn_box #photograph_signIn_take").off("click").on("click",function(){
						event.stopPropagation();
						event.preventDefault(); 
						jQuery("#upLoadImagesContainer input[type='file']").click();
					})
					// 签退
					jQuery(".page-content #signOut_box #photograph_signOut_take").off("click").on("click",function(){
						event.stopPropagation();
						event.preventDefault(); 
						jQuery("#upLoadImagesContainerOut input[type='file']").click();
					})
					// nfc签到
					jQuery(".page-content #signIn_box #nfc_signIn_take").off("click").on("click",function(){
						event.stopPropagation();
						event.preventDefault(); 
						self.signType = 1
						native.scanQrCode();
					})
					// nfc签退
					jQuery(".page-content #signOut_box #nfc_signOut_take").off("click").on("click",function(){
						event.stopPropagation();
						event.preventDefault(); 
						self.signType = 2
						native.scanQrCode();
					})
				},
				scanningreciviceLocation: function (qRcode){
					let self = this
					var u = navigator.userAgent;
					var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
					var isIOS = u.indexOf('iPhone') > -1 || u.indexOf('iPad') > -1; //IOS终端
					if(isIOS){
						self.content = qRcode.toString().slice(3)
					}else{
						self.content = qRcode
					}
					self.signInSignOutNfc()
				},
				signInSignOutNfc: function(){
					let self = this
					var date = moment().format("YYYY-MM-DD HH:mm:ss");
					Dao.onSign({
						signUser: userInfor.accountName,
						signOrg:self.signOrg,
						type:self.signType,
						signType:2,
						signNfc:self.content,
						strSignDate:date,
						longitude: self.longitude? self.longitude:"0",
						latitude: self.latitude ? self.latitude : "0",
						radius: self.radius,
						orgId: userInfor.org.id,
						userLongitude: self.userLongitude,
						userLatitude: self.userLatitude,
					}, function(data){
						self.signInRecord()
						if(self.signType === 1){
							jQuery(".page-content #signIn_box .sign-nfc").hide()
							jQuery(".page-content #signIn_box .sign-nfcs").show()
							let str = 5
							var signIn_success = setInterval(function(){
								str--
								jQuery("#signIn_success").html(str)
								if(str == 0){
									clearInterval(signIn_success)
									self.htmlPage();
								}
							},1000)
							
						}else{
							jQuery(".page-content #signOut_box .sign-nfc").hide()
							jQuery(".page-content #signOut_box .sign-nfcs").show()
							let str = 5
							var signOut_success = setInterval(function(){
								str--
								jQuery("#signOut_success").html(str)
								if(str == 0){
									clearInterval(signOut_success)
									self.htmlPage();
								}
							},1000)
							
						}
						
					}, true); 
				},
				signInRecord(){
					let self = this
					jQuery("#signIn_out #timeline").empty()
					Dao.getSignRecordGroupList({
						signOrgIds: self.selectOptionOrg ? self.selectOptionOrg : userInfor.organizationIds,
						queryType:0,
						signUser:self.signUser ? self.signUser : userInfor.accountName, 
						startTime:self.startTime,
						endTime:self.endTime
					}, function(res){
						if(res.length>0){
							jQuery("#signIn_out .sign-record p").html("最近签到记录")
							for(let i=0;i<res.length;i++){
								jQuery("#signIn_out #timeline").append(`
										<div class="timeline-title">
									<img src="${staticPath}img/notInScope/areaIcon.png" />
									<p>`+res[i].signOrgName+`</p>
								</div>
								<div class="timeline">
									<div class="timeline-item">
										<div class="timeline-item-divider"></div>
										<div class="timeline-item-content">
											<p class="signInDate_`+res[i].signInDate+`">`+res[i].signInDate+`签到</p>
										</div>
									</div>
									<div class="timeline-item">
										<div class="timeline-item-divider"></div>
										<div class="timeline-item-content">
											<p class="signOutDate_`+res[i].signOutDate+`">`+res[i].signOutDate+`签退</p>
									</div>
								</div>`)
								
								if(res[i].signInDate == null){
									jQuery("#signIn_out .signInDate_null").html("暂未签到").css("color","#F44949")
								}
								if(res[i].signOutDate == null){
									jQuery("#signIn_out .signOutDate_null" ).html("暂未签退").css("color","#F44949")
								}
								// if(res[i].signOutDataType == 2){
								// 	jQuery("#signIn_out .signOutDate_null" ).html("系统补签退")
								// }
							}
						}else{
							jQuery("#signIn_out .sign-record p").html("最近暂无签到记录")
							jQuery("#signIn_out #timeline").empty()
						}
					})
				},
				signOut:function(){
					let self = this
					var date = moment().format("YYYY-MM-DD HH:mm:ss");
					// jQuery(".page-content #signOut_box .signOut-box").off("click").on("click",function(){
					Dao.onSign({
						signUser: userInfor.accountName,
						signOrg:self.signOrg,
						type:2,
						signType:1,
						signPicUrl: self.signPicUrl,
						strSignDate:date,
						longitude: self.longitude? self.longitude:"0",
						latitude: self.latitude ? self.latitude : "0",
						radius: self.radius,
						// result: self.result,
						orgId: userInfor.org.id,
						userLongitude: self.userLongitude,
						userLatitude: self.userLatitude,
					}, function(data){
						self.signInRecord()
						jQuery(".page-content #signOut_box .sign-nfc").hide()
						jQuery(".page-content #signOut_box .sign-nfcs").show()
						let str = 5
						var signOut_success = setInterval(function(){
							str--
							jQuery("#signOut_success").html(str)
							if(str == 0){
								clearInterval(signOut_success)
								self.htmlPage();
							}
						},1000)
					}, true); 
					// })
				},
				signIn:function(){
					let self = this
					var date = moment().format("YYYY-MM-DD HH:mm:ss");
					// jQuery(".page-content #signIn_box .signIn-box").off("click").on("click",function(){
					Dao.onSign({
						signUser: userInfor.accountName,
						signOrg:self.signOrg,
						type:1,
						signType:1,
						signPicUrl: self.signPicUrl,
						strSignDate:date,
						longitude: self.longitude? self.longitude:"0",
						latitude: self.latitude ? self.latitude : "0",
						radius: self.radius,
						// result: self.result,
						orgId: userInfor.org.id,
						userLongitude: self.userLongitude,
						userLatitude: self.userLatitude,
					}, function(data){
						self.signInRecord()
						jQuery(".page-content #signIn_box .sign-nfc").hide()
						jQuery(".page-content #signIn_box .sign-nfcs").show()
						let str = 5
						var signIn_success = setInterval(function(){
							str--
							jQuery("#signIn_success").html(str)
							if(str == 0){
								clearInterval(signIn_success)
								self.htmlPage();
							}
						},1000)
					}, true); 
					// })
				},
				test(){
					jQuery("#not_in_scope").animate({"top":"0px"});
					jQuery("#not_in_scope").animate({"top":"20px"});
					jQuery("#imgTopBack").animate({"width":"32px"});
					jQuery("#imgTopBack").animate({"width":"28px"});
				},
				// 签到
				// commitSignIn: function() {
				// 	var self = this;
				// 	var date = moment().format("YYYY-MM-DD HH:mm:ss");
				 // 	Dao.commitSignIn({
				// 		signUser: userInfor.accountName,
				// 		signPicUrl: self.signPicUrl,
				// 		strSignDate:date,
				// 		signOrg:self.signOrg,
				// 		longitude: self.longitude? self.longitude:"0",
				// 		latitude: self.latitude ? self.latitude : "0",
				// 		radius: self.radius,
				// 		result: self.result,
				// 		orgId: userInfor.org.id,
				// 		userLongitude: self.userLongitude,
				// 		userLatitude: self.userLatitude,
				// 	}, function(data){
				// 		app.methods.showToastCenter("签到成功");
				// 	}, true); 
				// },
				//获取原生回调的位置信息
				getNativeBackLocation:function(longitude,latitude,location){
					var self = this;
					self.userLongitude = longitude;
					self.userLatitude = latitude;
					self.htmlPage();
					self.genClick()
				}
			},
			on: {
				pageInit: function (e, page) {
					var self = this;  
				},
				pageAfterIn:function (e, page) {
					var self = this;
					self.getData()
					   //获取当前定位
					// native.requestLocation();   
					// self.htmlPage();
					common.upload_qiniu_signIn(function (picUrl) {
						common.loading(0);
						self.signPicUrl = picUrl;
						self.signIn();
					});
					common.upload_qiniu_Out(function (picUrl) {
						common.loading(0);
						self.signPicUrl = picUrl;
						self.signOut();
					});
				 }
			}
		}
	</script>
	
	<style scoped>
	
	.check-content .main-content {
		background: #ffffff;
		border: 1px solid rgba(225, 225, 225, 0.9);
		box-shadow: 0px 1px 10px 0px rgba(181, 200, 206, 0.5);
		border-radius: 4px;
		margin: 20px 20px 0px 20px;
		position: relative;
	}
	
	.check-content .main-content .check-map {
		height: calc(100vh - 160px);
	}
	
	.check-content .check-info {
		margin-bottom: 10px;
		color: #999999;
		padding: 8px 16px 0px 16px;
		border-top: 1px solid rgba(208, 208, 208, 0.3);
	}
	
	.check-content .check-info #orgLocation {
		overflow: hidden;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		white-space: nowrap;
		display: block;
	}
	
	.check-content{
		padding-bottom: 100px;
	}
	
	.tb-name {
		font-size: 17px;
		font-family: PingFangSC-Semibold;
		font-weight: 600;
		color: rgba(36, 113, 202, 1);
	}
	
	.link-page-top>.segmented{
		display: inline-flex;
		align-items: center;
		background-color: #E7E7E7;
		padding: 0 0.1rem;
	}
	
	.link-page-top>.segmented>button{
		border: 0px solid #2196f3 !important;
		color: #aaaaaa;
	}
	
	.link-page-top>.segmented>button:nth-child(1),.link-page-top>.segmented>button:nth-child(3){
		width: 25%;
	}
	
	.link-page-top>.segmented>button:nth-child(2){
		width: 50%;
	}
	
	.link-page-top .button{
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	
	.link-page-top .button-actives{
		background-color: #ffffff;
		height: 2rem !important;
		line-height: 2rem;
		border-radius: 4px !important;
		color: #000000 !important;
	}
	
	.flex-tabkePhontos{
		position: absolute;
		width: calc(90% - 2rem);
		left: 5%;
		z-index: 10;
		bottom: 20px;
		padding: 1rem;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	
	.flex-tabkePhontos::after {
		content: "";
		background: #ffffff;
		opacity: 0.8;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		position: absolute;
		z-index: -1;   
		border-radius: 4px;
	}
	
	.beyond-area{
		position: relative;
		height: 140px;
	}
	
	.flex-tabkePhontos>div>div:nth-child(1)>img:nth-child(1){
		position: absolute;
		left: 50%;
		transform: translate(-50%);
		top: 20px;
	}
	
	.flex-tabkePhontos>div>div:nth-child(1)>img:nth-child(2){
		position: absolute;
		left: 50%;
		transform: translate(-50%);
		top: 100px;
		width: 28px;
	}
	
	.not-in-scope{
		color: #F32D2D;
		font-size: 16px;
	}
	
	.not-in-scope-click{
		color: #999999;
		font-size: 14px;
	}
	
	.not-in-scope-imgTop{
		width: 52px;
	}
	
	.sign-record{
		background-color: #fff;
		padding: 20px;
		position: relative;
		top: -100px;
		z-index: 20;
	}
	
	.refurbish{
		color: #006FEC;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		align-content: center;
		font-size: 16px;
	}
	
	.sign-record>p{
		color: #848484;
		margin-bottom: 20px;
	}
	
	.timeline{
		margin: 0 0 6px 0;
	}
	
	.timeline-item{
		padding: 2px 0 6px !important;
		margin-left: -12px;
	}
	
	.timeline-item-content>p{
		color: #aaaaaa;
		font-size: 14px;
	}
	
	.timeline-title{
		display: inline-flex;
		align-items: center;
	}
	
	.timeline-title>img{
		height: 18px;
	}
	
	.timeline-title>p{
		line-height: 18px;
		font-size: 16px;
		margin-left: 6px;
		white-space: nowrap;
	}
	
	.timeline-item .timeline-item-divider{
		width: 6px;
		height: 6px;
	}
	
	.timeline-item-divider:after, .timeline-item-divider:before{
		content: none;
	}
	
	.signIn-box,.signOut-box{
		width: 90px;
		height: 90px;
		border-radius: 50%;
		background: linear-gradient(#2471ca 0%, #5da8ff 100%);
		position: relative;
	}
	
	.signOut-box-flex{
		height: 100%;
		display: inline-flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}
	
	.signIn-box-flex{
		height: 100%;
		display: inline-flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}
	
	.photograph-signIn,.photograph-signOut{
		font-size: 16px;
		color: #fff;
		position: absolute;
		top: 26px;
		text-align: center;
		left: 50%;
		transform: translate(-50%);
		width: 100px;
	}
	
	.photograph-signIn-time,.photograph-signOut-time{
		text-align: center;
		position: absolute;
		bottom: 16px;
		left: 50%;
		transform: translate(-50%);
		color: #fff;
	}
	
	.orientation{
		font-size: 16px;
		color: #000000;
	}
	
	.sign-nfc,.sign-nfcs{
		display: inline-flex;
		flex-direction: column;
		align-items: center;
	}
	
	.sign-nfcs>p{
		font-size: 16px;
	}
	
	.sign-nfcs>p>span{
		color: red;
	}
	
	.signOut-box-flex .sign-nfc>p,.signIn-box-flex .sign-nfc>p{
		margin: 10px 0;
		padding-bottom: 2px;
		/* border-bottom: 1px solid #3583de; */
		text-align: center;
		color: #3583de;
		font-size: 16px;
	}
	
	.trajectory-map{
		height: 80vh;
	}
	
	.trajectory-map>div>div>div>span>div>img{
		display: none !important;
	}
	
	.trajectory-screen{
		position: fixed;
		bottom: 0;
		z-index: 10;
		width: 100%;
	}
	
	.trajectory-screen .segmented{
		width: 90%;
		margin-left: 5%;
		position: absolute;
		top: -24px;
		z-index: 10;
	}
	
	.trajectory-screen .segmented .button-outline.button{
		border: none;
		box-shadow: 0px 0px 10px 2px rgba(205,205,205,0.5);
		color: #000000;
		font-size: 14px;
		font-weight: 500;
		height: 46px;
		background: #ffffff;
	}
	
	.trajectory-screen .segmented .button-actives{
		border: none;
		background: #3696F2 !important;
		box-shadow: none !important;
	}
	
	.trajectory-screen-tc,.trajectory-history-tc{
		padding-top: 30px;
		background-color: #ffffff;
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
		position: relative;
	}
	
	.search-date{
		/* border-bottom: 1px solid #e1e1e1; */
		width: calc(100% - 20px);
		bottom: 50px;
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.search-dates{
		/* border-bottom: 1px solid #e1e1e1; */
		width: calc(100% - 20px);
		bottom: 50px;
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.search-people{
		/* border-top: 1px solid #e1e1e1; */
		width: calc(100% - 20px);
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.search-unit-sign{
		/* border-bottom: 1px solid #e1e1e1; */
		width: calc(100% - 20px);
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.search-date>p,.search-people>p,.search-unit-sign>p,.search-dates>p{
		margin-right: 10px;
		color: #999999;
		display: inline-flex;
		align-items: center;
		height: 2.2rem;
	}
	
	.search-date>p>img,.search-dates>p>img,.search-people>p>img,.search-unit-sign>p>img{
		height: 14px;
		margin-left: 6px;
	}
	
	.search-date-detail,.search-personnel-detail{
		width: 160px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		word-break: break-all;
		text-align: right;
	
	}
	
	.search-personnel{
		width: calc(100% - 20px);
		bottom: 0px;
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.search-personnels{
		width: calc(100% - 20px);
		bottom: 0px;
		margin: 0 10px;
		height: 50px;
		line-height: 50px;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
		/* border-top: 1px solid #e1e1e1; */
	}
	
	.search-personnel>p,.search-personnels>p{
		margin-right: 10px;
		color: #999999;
		display: inline-flex;
		align-items: center;
	}
	
	.search-personnel>p>img,.search-personnels>p>img{
		height: 14px;
		margin-left: 6px;
	}
	
	.search-left{
		margin-left: 10px;
	}
	
	.segmenteds .button-actives{
		background-color: #ffffff;
		height: 2rem !important;
		padding: 0.1rem;
		border-radius: 4px !important;
		color: #000000 !important;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	
	.segmenteds>button{
		height: 2rem !important;
		line-height: 2rem !important;
		border: 0px solid #2196f3 !important;
		color: #292929;
	}
	
	.segmenteds{
		height: 2.2rem !important;
		line-height: 2rem !important;
		background-color: #E7E7E7;
		padding: 0 0.1rem;
		width: 140px;
		border-radius: 4px;
	}
	
	.statistics-census{
		width: 90%;
		margin-left: 5%;
		border-radius: 4px;
	}
	
	.statistics-census .button.button-outline{
		border: none !important;
		box-shadow: 0px 0px 10px 2px rgba(205,205,205,0.5);
		color: #000000;
		font-size: 14px;
		font-weight: 500;
		height: 40px;
	}
	
	.statistics-census>.button-actives{
		background: #3696F2;
		box-shadow: none !important;
	}
	
	.statistics-census-check{
		width: 90%;
		margin-left: 5%;
		background-color: #ffffff;
		border-radius: 4px;
		box-shadow: 0px 0px 30px 6px rgba(205,205,205,0.5); 
		margin-top: 20px;
	}
	
	.statistics-date{
		display: inline-flex;
		align-items: center;
		justify-content: space-between;
		width: calc(100% - 20px);
		margin: 0 10px;
		height: 60px;
	}
	
	.statistics-personnel{
		display: inline-flex;
		align-items: center;
		justify-content: space-between;
		width: calc(100% - 20px);
		margin: 0 10px;
		height: 60px;
		/* border-bottom: 1px solid #E1E1E1; */
	}
	
	.statistics-date .segmented,.statistics-personnel .segmented{
		width: 120px;
		background-color: #E7E7E7;
		padding: 0 0.1rem;
		height: 2.2rem;
	}
	
	.statistics-date .segmented button,.statistics-personnel .segmented button{
		border: none !important;
		color: #aaaaaa;
		/* line-height: 2rem !important; */
	}
	
	.statistics-date .button-actives,.statistics-personnel .button-actives{
		background: #ffffff !important;
		line-height: 2rem !important;
		color: #000000 !important;
		height: 2rem !important;
		margin-top: 0.1rem;
		border-radius: 4px !important;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		line-height: 2rem !important;
	}
	
	.calendar{
		height: 400px;
	}
	
	.statistics{
		height: calc(100vh - 98px);
		overflow-y: auto;
		padding: 20px 0;
	}
	
	.calendar-custom-toolbar{
		margin-bottom: 30px;
	}
	
	.week-title{
		position: absolute;
		width: 100%;
		top: 52px;
		display: inline-flex;
		justify-content: space-around;
		color: #b8b8b8;
	}
	
	.icon-today {
		position: absolute;
		top: 25px;
	}
	
	#signCalender{
		width: calc(90% - 20px);
		margin-left: 5%;
		border-radius: 4px;
		box-shadow: 0px 0px 30px 6px rgba(205,205,205,0.5); 
		margin-top: 20px;
		padding: 10px;
	}
	
	#signCalender .calendar-day.calendar-day-today span {
		background: rgba(225, 225, 225, 1);
		opacity: 0.5;
		border-radius: 50%;
		color: #000;
	}
	
	#signCalender .calendar-day.calendar-day-today .icon-today {
		color: #fff;
	}
	
	#signCalender .calendar-day.calendar-day-selected .icon-today {
		color: #fff;
	}
	
	#signCalender .calendar-day.calendar-day-selected span{
		background: #3696F2;
		color: #fff;
		opacity: 1;
	}
	
	.toolbar-inner{
		/* border-bottom: 1px solid #e1e1e1; */
	}
	
	.toolbar-inner .center{
		font-size: 18px;
	}
	
	.signIn-signOut-system{
		display: flex;
		flex-wrap: wrap;
		width: 84%;
		margin-left: 8%;
		top: 60px;
		margin-top: 20px;
		justify-content: space-between;
	}
	
	.signIn-signOut-system>div{
		width: 30%;
		height: 90px;
		background: rgba(55, 152, 243, 1);
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		border-radius: 4px;
	}
	
	.signIn-signOut-system>div>span:nth-child(2){
		color: #fff;
		opacity: 0.6;
		font-size: 14px;
		margin-top: -10px;
	}
	
	.signIn-signOut-system>div>span:nth-child(1){
		font-size: 20px;
		color: #fff;
		margin-bottom: 2px;
		font-size: 38px;
	}
	
	.signIn-signOut-everyDay{
		font-size: 16px;
		padding-top: 20px;
		text-align: center;
		color: #b8b8b8;
	}
	
	.month-signIn-signOut{
		width: 90%;
		margin-left: 5%;
		box-shadow: 0px 0px 30px 6px rgba(205,205,205,0.5); 
		margin-top: 20px;
		border-radius: 4px;
	}
	
	.month-signIn-signOut>div>.signPicUrl-img>div{
		width: 100px !important;
		height: 100px !important;
		background-color: #E7E7E7;
		border-radius: 4px;
	}
	
	.month-signIn-signOut>div{
		display: inline-flex;
		/* border-bottom: 1px solid #DDDDDD; */
		width: calc(100% - 40px);
		margin: 20px 20px 0;
		padding-bottom: 20px;
		align-items: center;
	}
	
	.month-signIn-signOut>div>div:nth-child(2){
		margin-left: 20px;
		display: inline-flex;
		flex-direction: column;
		height: 80px;
		justify-content: space-around;
	}
	
	.month-signIn-signOut>div>div .image-item{
		width: 100px;
		height: 100px;
	}
	
	.month-signIn-signOut>div>div>p{
		display: inline-flex;
		align-items: center;
	}
	
	.month-signIn-signOut>div>div>.sign-user-name{
		font-weight: bold;
	}
	
	.month-signIn-signOut>div>div>p>img{
		width: 16px;
		height: 16px;
		margin-right: 4px;
	}
	
	.month-signIn-signOut>div>div>p>span{
		color: #999999;
		margin-top: 1px;
	}
	.SignLastPointIconBG {
		/* min-width: 100px; */
		width: auto;
		background: url('./img/SignLastPointIcon-bg.png') no-repeat;
		background-position: center;
		background-size: 100% 100%;
		padding: 0px 10px 8px 0px;
		display: flex;
		align-items: center;
	}
	.baiduMark-dutys{
		opacity: 0.8;
		padding: 0px 0px 0px 0px;
		display: flex;
		align-items: center;
		text-align: center;
		justify-content: center;
		background-color: #47CFAD;
		border-radius: 4px;
		padding: 4px 10px 4px 10px;
		font-weight: normal;
	}
	.baiduMark-dutys:after{
		content: '';
		width: 0;
		height: 0;
		border: 10px solid;
		position: absolute;
		left: 8.5px;
		bottom: -2px;
		border-color:  #47CFAD transparent transparent;
	}
	.researchersTrac_pop {
		width: 180px;
		/* height:40px; */
		opacity: 0.8;
		padding: 0px 0px 0px 0px;
		display: flex;
		align-items: center;
		text-align: center;
		justify-content: center;
		background-color: #3697F3;
		border-radius: 4px;
		padding: 10px 0px;
		position: relative;
	}
	.researchersTrac_pop:after{
		content: '';
		width: 0;
		height: 0;
		border: 10px solid;
		position: absolute;
		bottom: 0;
		transform: translateY(20px);
		border-color:  #3697F3 transparent transparent;
	}
	
	.flex-bottom{
		display: inline-flex;
		width: 100%;
		justify-content: space-between;
	}
	
	.flex-bottom>p:nth-child(1){
		width: 70%;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	
	.channel-del{
		font-weight: bold !important;
		width: 150px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	
	.picker-columns{
		justify-content: space-around;
	}
	
	.link-page-nav{
		position: relative;
	}
	
	.link-page-nav a{
		position: absolute;
	}
	
	.unit-orgName{
		background-color: #3697F3;
		border: none;
		padding: 2px 10px;
		position: relative;
		border-radius: 4px;
		font-weight: bold;
	}
	
	.unit-orgName:after{
		content: '';
		width: 0;
		height: 0;
		border: 10px solid;
		position: absolute;
		bottom: 0;
		left: 11px;
		transform: translateY(20px);
		border-color:  #3697F3 transparent transparent;
	}
	.viewStaffDistribution_baiduMark-duty{
    color:#000;
    font-size: 15px;
    font-weight: bold;
}
.viewStaffDistribution_baiduMark-dutys{
    /* display: inline-table; */
	opacity: 0.8;
	padding: 0px 0px 0px 0px;
    display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	background-color: #47CFAD;
	border-radius: 4px;
	padding: 4px 10px 4px 10px;
	font-weight: normal;
    position: relative;
}
.viewStaffDistribution_baiduMark-dutys:after{
	content: '';
	width: 0;
	height: 0;
	border: 10px solid;
	position: absolute;
	/* left: 14.5px; */
	bottom: 0;
	border-color:  #47CFAD transparent transparent;
    transform: translateY(20px) translateX(0px);
}
	</style>